<template>
  <div class="goods-base">
    <Form :model="data" :label-width="80">
      <FormItem label="商品名">
        <Input v-model="data.name" placeholder="请输入商品名称..."></Input>
      </FormItem>
      <FormItem label="商品编号">
        <Input v-model="data.goods_sn" placeholder="请输入商品编号..."></Input>
      </FormItem>
      <FormItem label="商品主图">
        <QiniuUp
          @getUrl="(v) => (data.goods_thumb = v)"
          :url="data.goods_thumb"
        />
      </FormItem>
      <FormItem label="商品轮播">
        <QiniuUps @getUrl="(v) => (data.goods_banner_imgs = v)" />
      </FormItem>
      <FormItem label="商品分类">
        <Select v-model="data.category_id">
          <Option
            :value="item._id"
            v-for="(item, ci) in cateList"
            :key="'cate' + ci"
            >{{ item.name }}</Option
          >
        </Select>
      </FormItem>
      <FormItem label="关键字">
        <Input
          v-model="data.keywords"
          placeholder="请输入关键字,用逗号分隔 例如:洗发液,养发..."
        ></Input>
      </FormItem>
      <FormItem label="商品简介">
        <Input
          v-model="data.goods_desc"
          placeholder="请输入商品简介..."
        ></Input>
      </FormItem>
      <FormItem label="商品价格">
        <Input
          v-model="data.price"
          placeholder="请输入商品价格(单位分)..."
        ></Input>
      </FormItem>
      <FormItem label="划线价格">
        <Input
          v-model="data.pre_price"
          placeholder="请输入商品价格(单位分)..."
        ></Input>
      </FormItem>
      <FormItem label="是否热销">
        <i-switch v-model="data.is_hot"></i-switch>
      </FormItem>
      <FormItem label="是否最新">
        <i-switch v-model="data.is_best"></i-switch>
      </FormItem>
      <FormItem label="是否实物">
        <i-switch v-model="data.is_real"></i-switch>
      </FormItem>
      <FormItem label="全部销量">
        <Input
          v-model="data.total_sell_count"
          placeholder="请输初始销量(默认0)..."
        ></Input>
      </FormItem>
      <FormItem label="卖家备注">
        <Input v-model="data.seller_note" placeholder="请输入备注..."></Input>
      </FormItem>
    </Form>
  </div>
</template>
<script>
import { list as cates } from "@/api/goodsCate";
export default {
  name: "GoodsBase",
  data() {
    return {
      cateList: [],
      data: {
        _id: "",
        name: "",
        category_id: "",
        goods_sn: "",
        comment_count: 0,
        goods_banner_imgs: [],
        goods_thumb: "",
        keywords: "",
        is_new: false,
        pre_price: 0,
        is_real: false,
        remain_count: 0,
        goods_desc: "",
        total_sell_count: 0,
        is_best: false,
        seller_note: "",
        is_on_sale: false,
        month_sell_count: 0,
        is_alone_sale: false,
        is_hot: false,
        price: 0,
      },
    };
  },
  watch: {
    data: {
      handler(newValue) {
        this.$emit("value", newValue);
      },
      deep: true,
    },
  },
  created() {
    cates().then((res) => {
      this.cateList = res.data.data;
    });
  },
  props: {
    goods: {
      // 外部传递进来的商品信息
      type: Object,
      default: null,
    },
  },
};
</script>